import { NavBar, SearchBar, Toast, Tabs } from 'antd-mobile';
import OrderListItem from '@/components/OrderListItem';

const Order = () => {
  return (
    <div class="order">
      <NavBar title="我的订单" left-arrow >我的订单</NavBar>
      <van-tabs v-model="active">
        <van-tab title="全部"></van-tab>
        <van-tab title="待支付"></van-tab>
        <van-tab title="待发货"></van-tab>
        <van-tab title="待收货"></van-tab>
        <van-tab title="待评价"></van-tab>
      </van-tabs>

      <Tabs
        style={{
          '--active-line-border-radius': '2px',
          '--active-title-color': 'var(--adm-color-danger)',
          '--active-line-color': 'var(--adm-color-danger)',
        }}>
        <Tabs.Tab title='全部' key='all'>
          全部
        </Tabs.Tab>
        <Tabs.Tab title='待支付' key='tobepay'>
          待支付
        </Tabs.Tab>
        <Tabs.Tab title='待发货' key='tobeshipped'>
          待发货
        </Tabs.Tab>
        <Tabs.Tab title='待收货' key='tobereceived'>
          待收货
        </Tabs.Tab>
        <Tabs.Tab title='待评价' key='tobeevaluated'>
          待评价
        </Tabs.Tab>
      </Tabs>

      <OrderListItem></OrderListItem>
    </div>
  );
};

export default Order;